<template>
	<view class="main">
		<!--<cover-image src = "../../static/bg.png"></cover-image>-->
		<view class="main">
			<!--<view id="head1" class="flex justify-around">
				<view class="flex align-center">
					<text class="text-white text-xl">地区</text>
					<view class="cuIcon-triangledownfill text-white" style="font-size: 50upx"></view>
				</view>
				<view></view><view></view><view></view><view></view>
				<view class="flex align-center">
					<navigator>
						<view class="cuIcon-add text-white text-bold" style="font-size: 50upx"></view>
					</navigator>
				</view>
			</view>-->
			<view class="margin-top-sm">
				<u-toast ref="uToast"></u-toast>
				<u-swiper :height="250" :list="list" :title="title" :effect3d="effect3d" 
				:indicator-pos="indicatorPos" :mode="mode" :interval="3000" @click="click"></u-swiper>
			</view>
			<!--两个功能按钮-->
			<view id="btn" class="flex justify-around margin-top-lg">
				<navigator url="creorder" class="flex btn-box bg-gradual-blue align-center justify-center">
					<text class="text-xxl text-shadow">上门预约</text>
					<text class="cuIcon-taxi padding-left-xs" style="font-size: 90upx;opacity: 0.2"></text>
				</navigator>
				<navigator url="orderlist" class="flex btn-box bg-gradual-green align-center justify-center">
					<text class="text-xxl text-shadow">上门回收</text>
					<text class="cuIcon-refund padding-left-xs" style="font-size: 90upx;opacity: 0.2"></text>
				</navigator>
			</view>
			
			<view id="btn" class="flex justify-around margin-top-lg">
				<navigator url="../sort/indexes" class="flex btn-box bg-gradual-pink align-center justify-center">
					<text class="text-xxl text-shadow">分类查询</text>
					<text class="cuIcon-taxi padding-left-xs" style="font-size: 90upx;opacity: 0.2"></text>
				</navigator>
				<navigator url="../index/map" class="flex btn-box bg-gradual-purple align-center justify-center">
					<text class="text-xxl text-shadow">站点统计</text>
					<text class="cuIcon-refund padding-left-xs" style="font-size: 90upx;opacity: 0.2"></text>
				</navigator>
			</view>
		
		    <view id="chuxing" class="flex  justify-center align-center margin-top-sm">
		    	<view class="head_box">			
		    		<view class="flex justify-around text-df padding-top">
		    			<text>今日下单情况</text>
		    			<text>（单位：个）</text>
		    		</view>
		    		<view class="flex justify-around padding-top-xl">
		    			<view class="flex flex-direction align-center">
		    				<text class="text-orange text-bold">1</text>
		    				<text>预定总数</text>
		    			</view>
		    			<view class="flex flex-direction align-center">
		    				<text class="text-orange text-bold">2</text>
		    				<text>已处理</text>
		    			</view>
		    			<view class="flex flex-direction align-center">
		    				<text class="text-orange text-bold">3</text>
		    				<text>待处理</text>
		    			</view>
		    		</view>
		    	</view>
		    </view>
		
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
						image: 'https://dpic2.tiankong.com/bp/xp/QJ9126410870.jpg@!350h',
						title: '昨夜星辰昨夜风，画楼西畔桂堂东'
					},
					{
						image: 'https://dpic3.tiankong.com/mg/h0/QJ6145189867.jpg@!350h',
						title: '身无彩凤双飞翼，心有灵犀一点通'
					},
					{
						image: 'https://dpic2.tiankong.com/xi/ln/QJ6635899230.jpg@!350h',
						title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
					}
				],
				title: false,
				mode: 'round',
				indicatorPos: 'bottomCenter',
				effect3d: true,
			}
		},
		onLoad() {

		},
		methods: {
			open(){
				uni.navigateTo({
					url: 'creorder',
					animationType: 'slide-in-right',
					animationDuration: '200'
				})
			}
		}
	}
</script>

<style>
	cover-image {
		position: absolute;
		left: 0;
		top: 0;
		height: 400rpx;
		width: 100%;
	}
	.main{
		position: absolute;
		top: 0;width: 100%;
	}
	.btn-box{
		width: 310upx;
		height: 150upx;
		border-radius: 20upx;
	}
	.head_box{
		width: 700upx;
		height: 220upx;
		background-color: #ffffff;
		border-radius: 15upx;
	}
</style>
<style lang="scss" scoped>
	.item {
		margin: 30rpx 0;
	}
</style>